<template>
  <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" :close-on-click-modal="false">
    <el-form ref="dataForm" :rules="rules" :model="temp" label-position="left" label-width="80px"
      style="width: 90%; margin-left:50px;">
      <el-row :gutter="40">
        <el-col :span="12" v-show='isbool'>
          <el-form-item label="标签组">
            <el-cascader v-model="temp.labelId" :options="treeList" :props="treeProps" :show-all-levels="false"
              change-on-select clearable style="width: 100%" @change='treeListCnage' />
          </el-form-item>
        </el-col>
        <el-col :span="12" v-show='isbool1'>
          <el-form-item label="标签">
            <el-cascader v-model="temp.labelId1" :options="treeList1" :props="treeProps1" :show-all-levels="false"
              change-on-select clearable style="width: 100%" />
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="off()">
        {{ $t('table.cancel') }}
      </el-button>
      <el-button type="primary" :loading="loading" @click="createData()">
        {{ $t('table.confirm') }}
      </el-button>
    </div>
  </el-dialog>
</template>

<script>
import { createcolumn, updatecolumn, getcolumn } from '@/api/metadata/column'
import { fetchMetadataLabelGroupList } from '@/api/metadata/label/metadataLabelGroup'
import { fetchMetadataLabelList, deletecaveasmodelid, updateMasterdataDirectory } from '@/api/metadata/label/metadataLabel'
export default {
  name: 'columnForm',
  data() {
    return {
      isbool: true,
      isbool1: false,
      rules: {
      },
      temp: {},
      treeList: [],
      treeList1: [],
      treeProps: {
        value: 'id',
        label: 'name',
        expandTrigger: 'hover'
      },
      treeProps1: {
        value: 'id',
        label: 'label',
        expandTrigger: 'hover'
      },
      textMap: {
        update: '标签绑定',
        create: '新建'
      },
      id: "",
      loading: false,
      dialogFormVisible: false,
      dialogStatus: '',
      leibelId: "",
      listQuery: {
        page: 1,
        limit: this.$store.getters.defaultPageSize,
      },
    }
  },
  mounted() {

  },

  methods: {
    off() {
      this.temp = {}
      this.isbool1 = false
      this.dialogFormVisible = false
    },
    treeListCnage() {
      if (this.temp.labelId !== '') {
        this.listQuery.gid = this.temp.labelId
        console.log(this.listQuery.gid);
        this.isbool1 = true
        fetchMetadataLabelList(this.listQuery).then(res => {
          if (res.data.code == 0) {
            this.treeList1 = res.data.data
          }
        })
      }
    },
    getListArr() {
      fetchMetadataLabelGroupList().then(res => {
        if (res.data.code == 0) {
          this.treeList = res.data.data
        }
      })

    },

    getList() {
      this.$emit('refreshList')
    },
    resetTemp() {
      this.loading = false
      this.temp = {
        id: undefined,
        sourceId: undefined,
        tableId: undefined,
        columnName: undefined,
        columnComment: undefined,
        columnKey: undefined,
        columnNullable: undefined,
        columnPosition: undefined,
        dataType: undefined,
        dataLength: undefined,
        dataPrecision: undefined,
        dataScale: undefined,
        dataDefault: undefined,
        labelId: undefined,
        forginId: undefined
      }
    },
    handleCreate() {
      this.resetTemp()
      this.dialogStatus = 'create'
      this.dialogFormVisible = true
      this.$nextTick(() => {
        this.$refs['dataForm'].clearValidate()
      })
    },
    handleUpdate(id) {
      this.resetTemp()
      this.id = id
      this.dialogStatus = 'update'
      this.dialogFormVisible = true
      this.getListArr()

      deletecaveasmodelid({ id: id }).then(res => {
        if (res.data.code == 0) {
          if (res.data.data) {
            this.temp.labelId = [res.data.data.gId]
            this.isbool1 = true
            this.treeListCnage()
            this.leibelId = res.data.data.id
            this.temp.labelId1 = res.data.data.tId
          } else {
            this.isbool1 = false
          }


        }
      })
    },

    createData() {
      let obj = { id: this.leibelId, fId: this.id, gId: this.temp.labelId[0], tId: this.temp.labelId1[0] }
      updateMasterdataDirectory(obj).then(res => {
        if (res.data.code == 0) {
          this.$message.success(res.data.msg)

          this.off()
        }
      })
    },
    // updateData() {
    //   this.$refs['dataForm'].validate((valid) => {
    //     if (valid) {
    //       if (this.temp.labelId !== undefined && this.temp.labelId !== '' && this.temp.labelId instanceof Array) {
    //         this.temp.labelId = this.temp.labelId[this.temp.labelId.length - 1]
    //       }

    //       this.loading = true
    //       updatecolumn(this.temp).then(response => {
    //         this.loading = false
    //         if (response.data.code === 0) {
    //           this.dialogFormVisible = false
    //           this.getList()
    //           this.$message.success(response.data.msg)
    //         } else {
    //           this.$message.error(response.data.msg)
    //         }
    //       })
    //     }
    //   })
    // }
  }
}
</script>
